<template>
  <div>
    <ZfwSearchForm :fileds="fileds" @onSearch="onSearch">
      <template #operate>
        <el-button size="small" plain type="primary" icon="el-icon-plus" @click="add">新增</el-button>
        <!-- <el-button size="small" plain type="danger" icon="el-icon-delete" @click="del">删除</el-button> -->
        <el-button size="small" plain type="success" icon="el-icon-upload2" @click="handleUpload">导出</el-button>
      </template>
    </ZfwSearchForm>
    <zfw-table row-key="businessId" :column="column" :onSearch="handleSearch" @selectChange="selectChange"
      :params="params" ref="tableRef">
      <template #readStatus="{ row }">
        <el-tag v-if="row.status === 'DRAFT'" type="info">{{ row.statusName }}</el-tag>
        <el-tag v-else-if="row.status === 'UNDO'" type="warning">{{ row.statusName }}</el-tag>
        <el-tag v-else-if="row.status === 'DONE'" type="success">{{ row.statusName }}</el-tag>
        <el-tag v-else type="parmary">{{ row.statusName }}</el-tag>
      </template>
      <template #operate="{ row }">
        <el-button type="danger" size="small" @click="handleParate(row)"
          v-if="row.status == 'DRAFT' || row.status == 'UNDO'">处理</el-button>
        <el-button type="primary" size="small" @click="detail(row)"
          v-if="row.status == 'DONE' || row.status == 'REBACK'">查看</el-button>
      </template>
    </zfw-table>

    <!-- 处理 -->
    <detail-dialog v-if="visible" :type="type" :id="businessId" :visible="visible" @close="handleDialogClose" />
    <!-- 新增 -->
    <AddPage v-if="addVisible" :type="type" :id="businessId" :visible="addVisible" @close="handleDialogAddClose" />
  </div>
</template>

<script>
import Mixin from "../config/mixin.js"
import AddPage from "../AddPage.vue"
import DetailDialog from "./components/detailDialog.vue"
import { getIapproveList } from "@/api/notice.js"
import { replaceFormData } from "@/utils/common.js"
export default {
  mixins: [Mixin],
  components: { AddPage, DetailDialog },
  data() {
    return {
      params: {
        deptName: "",
        createBy: "",
        time: [],
        endTime: "",
        startTime: "",
        businessStatus: "",
        title: this.$route.query.title ? this.$route.query.title : ''
      },
      selectArr: [],
      visible: false,
      addVisible: false,
      businessId: "",
      businessStatus: "",
      type: ""
    }
  },
  created() {
    if (this.$route.query.title) {
      this.params.title = this.$route.query.title
      this.onSearch(this.params)
      this.handleSearch(this.params)
    }
  },
  methods: {
    // 导出
    handleUpload() {
      const params = JSON.parse(JSON.stringify(this.params))
      const { time } = params
      if (Array.isArray(time) && time.length > 0) {
        params.startTime = time[0]
        params.endTime = time[1]
        delete params.time
      }
      this.download(
        "/workflow/taskinfo/export/DEPART",
        {
          ...params,
        },
        `部门通知_${new Date().getTime()}.xlsx`
      );
    },
    // 删除
    async del() {
      if (!this.selectArr.length) return this.$message.error("请选择需要删除的数据")
      console.log(this.selectArr)
      const id = this.selectArr.map(v => v.businessId)

    },
    // 处理
    handleParate(row) {
      this.businessId = row.id
      this.visible = true
    },
    // 查看详情
    detail(row) {
      this.type = 'detail'
      this.businessId = row.id
      this.visible = true
    },
    // 关闭弹框
    handleDialogClose() {
      this.visible = false
      this.$refs.tableRef.getTable()
    },
    handleDialogAddClose() {
      this.addVisible = false
      this.$refs.tableRef.getTable()
    },
    // 新增
    add() {
      this.type = 'add'
      this.businessId = ""
      this.addVisible = true
    },
    // 表单搜索
    onSearch(values) {
      this.params = values
    },
    async handleSearch(values) {
      const { time } = values
      if (Array.isArray(time) && time.length > 0) {
        values.startTime = time[0]
        values.endTime = time[1]
        delete values.time
      }
      const { code, data } = await getIapproveList(replaceFormData(values))
      if (code === 200) {
        return {
          list: data.records,
          total: data.total
        }
      }
    },
    // 多选
    selectChange(values) {
      this.selectArr = values
    }

  }
}
</script>
<style lang="scss" scoped></style>
